<template>
	<el-row class="remotecontrol">
		<el-col :span="24">
			<basic-container>
				<div class="form_wrapper">
					<el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="80px">

						<!-- 智控分类 -->
						<el-form-item label="智控分类" prop="controlType">
							<el-select placeholder="请选择智控分类" v-model="form.controlType" style="width: 220px;">
								<el-option v-for="(item, index) in controlTypes" :key="index" :label="item.dictValue" :value="item.dictKey"></el-option>
							</el-select>
						</el-form-item>

						<!-- MN号 -->
						<el-form-item label="MN" prop="mn">
							<el-input v-model="form.mn" placeholder="请输入MN号" disabled></el-input>
							<!--<el-select 
                                placeholder="请选择MN号" 
                                v-model="form.mn" 
                                style="width: 220px;"
                                @change="changeMN()"
                            >
                                <el-option
                                    v-for="(item, index) in mnList"
                                    :key="index"
                                    :label="item"
                                    :value="item"
                                ></el-option>
                            </el-select>-->
						</el-form-item>

						<!-- 单选设备类型 -->
						<el-form-item label="设备类型" prop="polId" v-if="form.controlType === '2'">
							<el-select placeholder="请选择设备类型" v-model="form.polId" style="width: 220px;">
								<el-option v-for="(item, index) in deviceTypes" :key="index" :label="item.alias" :value="item.code"></el-option>
							</el-select>
						</el-form-item>

						<!-- 多选设备类型 -->
						<el-form-item label="设备类型" prop="polIds" v-if="form.controlType === '3'">
							<el-select placeholder="请选择设备类型" v-model="form.polIds" style="width: 220px;" multiple>
								<el-option v-for="(item, index) in deviceTypes" :key="index" :label="item.alias" :value="item.code"></el-option>
							</el-select>
						</el-form-item>

						<!-- 时间 -->
						<el-form-item label="时间" prop="time" v-if="form.controlType === '1' || form.controlType === '2'">
							<el-date-picker v-model="form.time" type="datetime" placeholder="请选择时间" style="width: 220px;" ></el-date-picker>
						</el-form-item>

						<!-- 按钮 -->
						<el-form-item>
							<div class="button_wrapper">

								<!-- 数采仪 -->
								<el-button type="primary" size="medium" @click="daiCheckTime" v-if="form.controlType === '1'" :loading="btnLoading">
									设备校时
								</el-button>

								<!-- 设备 -->
								<el-button type="primary" size="medium" @click="deviceCheckTime" v-if="form.controlType === '2'" :loading="btnLoading">
									设备校时
								</el-button>

								<!-- 留样 -->
								<el-button type="primary" size="medium" @click="storeExample" v-if="form.controlType === '4'" :loading="btnLoading">
									立即留样
								</el-button>

								<!-- 测量 -->
								<el-button type="primary" size="medium" @click="measure" v-if="form.controlType === '3'" :loading="btnLoading">
									立即测量
								</el-button>

								<!-- 远程登录 -->
								<el-button type="primary" size="medium" @click="remoteLogin">远程登录</el-button>
							</div>
						</el-form-item>

					</el-form>
				</div>
			</basic-container>
		</el-col>
	</el-row>
</template>

<script>
	import {
		getMnBySiteInfoId,
		getMNList,
		getControlTypeList,
		getDeviceTypeList,
		updateRtuTime,
		updateDeviceTime,
		executeSample,
		executeMeasure
	} from "@/api/remotecontrol/remotecontrol";

	export default {
		data() {
			return {
				btnLoading:false, // 防重提交
				id: '',
				form: {
					controlType: "",
					polId: "",
					polIds: [],
					mn: '',
					time: null,
				},
				controlTypes: [],
				deviceTypes: [],
				rules: {
					mn: [{
						required: true,
						message: '请选择MN号',
						trigger: 'change'
					}],
					time: [{
						required: true,
						message: '请选择时间',
						trigger: 'change'
					}],
					polId: [{
						required: true,
						message: '请选择设备类型',
						trigger: 'change'
					}],
					polIds: [{
						required: true,
						message: '请选择设备类型',
						trigger: 'change'
					}]
				},
				mnList: [],
				remoteControl: {
					"数采仪": "1",
					"设备": "2",
					"测量": "3",
					"留样": "4"
				}
			}
		},
		mounted() {

		},
		methods: {
			// 获取智控分类列表
			initData(id) {
				this.id = id
				this.form.mn = ''
				this.form.time=new Date().format('yyyy-MM-dd hh:mm:ss')
				getMnBySiteInfoId(id).then(res => {
					this.form.mn = res.data.data
					this.changeMN()
				})
				getControlTypeList().then(res => {
					this.controlTypes = res.data.data;
				});
			},

			// 获取MN列表
			getMNs() {
				getMNList().then(res => {
					this.mnList = res.data.data
				});
			},

			// 更换MN号
			changeMN() {
				this.getDevices();
			},

			// 获取设备类型列表
			getDevices() {
				getDeviceTypeList(this.form.mn).then(res => {
					this.deviceTypes = res.data.data;
				});
			},

			timeChange(timer) {
				let time=new Date(timer)
				let M = (time.getMonth() + 1) < 10 ? "0" + (time.getMonth() + 1).toString() : (time.getMonth() + 1).toString()
				let d = time.getDate() < 10 ? "0" + time.getDate().toString() : time.getDate().toString()
				let h = time.getHours() < 10 ? "0" + time.getHours().toString() : time.getHours().toString()
				let m = time.getMinutes() < 10 ? "0" + time.getMinutes().toString() : time.getMinutes().toString()
				let s = time.getSeconds() < 10 ? "0" + time.getSeconds().toString() : time.getSeconds().toString()
				this.form.time = time.getFullYear().toString() + M + d + h + m + s
				
			},

			/**
			 * 远程登录
			 */
			remoteLogin() {
				window.open("http://124.71.156.219:61104/")
			},

			// 数采仪设备校时
			daiCheckTime() {
				this.$refs.form.validate(valid => {		
					if(valid) {
						this.timeChange(this.form.time)	
						this.btnLoading=true
						updateRtuTime(this.id, this.form.mn, this.form.time).then(res => {
							this.btnLoading=false
							if(res.data.data.code == 200) {
								this.$message.success('校时成功')
							} else {
								this.$message.warning(res.data.data.msg)
							}
							this.$emit('finish')
						});
					}
				});
			},

			// 设备设备校时
			deviceCheckTime() {
				this.$refs.form.validate(valid => {
					
					if(valid) {
						this.timeChange(this.form.time)
						this.btnLoading=true
						updateDeviceTime(this.id, this.form.mn, this.form.polId, this.form.time).then(res => {
							this.btnLoading=false
							if(res.data.data.code == 200) {
								this.$message.success('校时成功')
							} else {
								this.$message.warning(res.data.data.msg)
							}
							this.$emit('finish')
						});
					}
				});
			},

			// 留样立即留样
			storeExample() {
				this.$refs.form.validate(valid => {
					if(valid) {
						this.btnLoading=true
						executeSample(this.id, this.form.mn).then(res => {
							this.btnLoading=false
							if(res.data.data.code == 200) {
								this.$message.success('留样成功')
							} else {
								this.$message.warning(res.data.data.msg)
							}
							this.$emit('finish')
						});
					}
				});
			},

			// 测量立即测量
			measure() {
				this.$refs.form.validate(valid => {
					if(valid) {
						this.btnLoading=true
						var ids = this.form.polIds.join(",");
						executeMeasure(this.id, this.form.mn, ids).then(res => {
							this.btnLoading=false
							if(res.data.data.code == 200) {
								this.$message.success('测量成功')
							} else {
								this.$message.warning(res.data.data.msg)
							}
							this.$emit('finish')
						});
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.form_wrapper {
		display: flex;
		justify-content: center;
		padding: 10px 0;
		.button_wrapper {
			width: 100%;
			display: flex;
			justify-content: space-between;
		}
	}
</style>